{extend name="public/base"}

{block name="title"}就行天下-抢单{/block}

{block name="style"}
<link rel="stylesheet" href="__STATIC__/home/css/index.css" />
{/block}

{block name="main"}
<div class="pageControl lookIndent bg-f7">
    <div class="main-top"></div>
    <div class="msui_nav msui_navTop">
        <a class="msui_navTop-back" href="javascript:history.back();"><i class="micon-back"></i></a>
        <h1 class="msui_navTop-title">单订详情</h1>
        <a href="" class="msui_navTop-right msui_navTop-cnav"><i class="micon-cnav"></i></a>
    </div>
    <a href="javascript:;" class="open-popup grapSingle">
        <img src="__STATIC__/home/images/flow_1.png" alt="">
    </a>
    <div class="weui-cell">
        <div class="weui-cell__bd">
            <p>配送方式: <span>{$data.consignment_type}</span></p>
            <p class="cl-9999">订单号: <span>{$data.order_sn}</span></p>
        </div>
    </div>
    <div class="">
        <div class="weui-cell">
            <div class="weui-cell__hd indentImg">
                <img src="{$data.headimgurl}" alt="">
            </div>
            <div class="weui-cell__bd">
                <p class="fs07">{$data.nickname}</p>
                <div class="my-flex1 cl-9999 fs065">
                    下单时间: <span>{$data.create_time|date="Y-m-d H:i:s", ###}</span>
                </div>
            </div>
            <div class="weui-cell__ft">
            </div>
        </div>
        <div class="weui-cell confirmOrder">
            <div class="weui-cell__hd">
                <img src="__STATIC__/home/images/product3.png" alt="">
            </div>
            <div class="weui-cell__bd ">
                <p class="fs06 listFont">{$data.msg}</p>
            </div>
        </div>
        <div class="weui-cell">
            <div class="weui-cell__hd img_08 mr06">
                <img src="__STATIC__/home/images/address.png" alt="">
            </div>
            <div class="weui-cell__bd">
                <p class="fs06"><span>联系电话：</span> <span>{$data.mobile}</span></p>
                <p class="fs06"><span>联系人：</span> <span>{$data.consignee}</span></p>
                <p class="fs06 cl-9999"><span>{$data.address}</span></p>
            </div>
        </div>
    </div>
</div>
<!--抢单成功-->
<div id="singleSucc" class="centerPopup weui-popup__container">
    <div class="weui-popup__overlay"></div>
    <div class="weui-popup__modal singleSucc">
        <div class="single-img">
            <p>
                <img src="__STATIC__/home/images/single1.png" alt="">
            </p>
        </div>
        <div class="fs065 title">
            恭喜您，抢单成功啦！请尽快处理订单
        </div>
        <a href="{:url('shop_order_list', ['id' => $data.id])}" class="close-popup fs06 singleBtn cl-f">知道了</a>
    </div>
</div>
<!--抢单失败-->
<div id="singleDefeated" class="centerPopup weui-popup__container">
    <div class="weui-popup__overlay"></div>
    <div class="weui-popup__modal singleDefeated">
        <div class="single-img">
            <p>
                <img src="__STATIC__/home/images/single2.png" alt="">
            </p>
        </div>
        <div class="fs065 title">
            很遗憾，该订单已被抢，下次要手快哟
        </div>
        <a href="javascript:window.history.back();" class="close-popup fs06 singleBtn cl-f">抢新的订单</a>
    </div>
</div>
{/block}

{block name="javascript"}
<script>
    $(function () {
        $(".grapSingle").click(function (e) {
            e.preventDefault();
            $.showLoading();
            $.ajax({
                type : 'POST',
                url : '{:url("vie_for_order")}',
                data : {
                    id : '{$data.id}',
                    shop_id : '{$shop_id}'
                },
                dataType : 'json',
                success : function (msg) {
                    console.log(msg);
                    $.hideLoading();
                    if (msg.code == 200) {
                        $('#singleSucc').popup();
                    } else{
                        $('#singleDefeated').find('.title').text(msg.msg).end().popup();
                    }
                }
            });
        });
    });
</script>
{/block}